<template>
	<view class="page">
		<!-- 收货地址 -->
		<view class="address">
			<view class="address-list">
				<view class="iconfont icon-dingwei"></view> <!-- 这里可以换成定位图标 -->
				<view class="addressDeatil" >{{address.address}}</view>
			</view>
		

		</view>
		<view class="address">
		
			<view class="address-list">
				<view class="addressDeatil" >{{address.name}}</view>
			</view>
		
		
		</view>
		<view class="address">
		
			<view class="address-list">
				<view class="addressDeatil" >{{address.mobile}}</view>
			</view>
		
		</view>
		<view class="goods">
			<view class="titleList">
				<view class="iconfont icon-zhuyi"></view> <!-- 这里可以换成定位图标 -->
				<view class="titileDtail">对方物品</view>
			</view>
			<!-- 商品列表 -->
			<view class="goodsLists">
				<view class="list"  >
					<view class="good" @click="gotodetail(goodsInfo)">
						<view class="thumb">
							<image :src="goodsInfo.img_list[0]" mode=""></image>

						</view>
						<view class="item">
							<view class="title">
								{{goodsInfo.title}}
							</view>
							<view class="titleDeatil">
								{{goodsInfo.introduce}}
							</view>
						</view>
						
					</view>
				</view>

			</view>
		</view>
		<view class="goods">
			<view class="titleList">
				<view class="iconfont icon-zhuyi"></view>
				<view class="titileDtail">我的物品</view>
			</view>
			<!-- 商品列表 -->
			<view class="goodsLists">
				<view class="list" v-for="(item, index) in goodsList" @click="gotodetail(item,)" :key="index">
					<view class="check" @click="toggleCheck(index)">
						<text class="iconfont" :class="item.isChecked ? 'icon-checked' : 'icon-check'"></text>
					</view>
					<view class="good">
						<view class="thumb">
							<image :src="item.img_list[0]" mode=""></image>

						</view>
						<view class="item">
							<view class="title">
								{{item.title}}
							</view>
							<view class="titleDeatil">
								{{item.introduce}}
							</view>
						</view>
						
					</view>
				</view>

			</view>
		</view>
		<view class="button" @click="exchange">
			立即兑换
		</view>
	</view>
</template>

<script>
	import {
		getStoreGoodsListYihuo,
		getgoodsAddress,
		yihuoorder
	} from '@/config/api.js';
	export default {
		data() {
			return {
				listQuery:{
					page:1,
					limit:30,
				},
				goodsList: [{
						id: 1,
						name: '韩版大码宽松显瘦套装裙子两件套 JX19301 上豆绿下米白 M ',
						price: '219.00',
						vip_price: '129.00',
						img: 'https://p3.ssl.qhimgs1.com/sdr/400__/t0485eb72d6fc28e0d9.jpg',
						attributes: ['金色', '大尺码'],
						is_goods: 0,
						isChecked: false,
					},
					{
						id: 1,
						name: '时尚长袖T恤外套上衣男生情侣装套头衣服秋天男装 白色 XL',
						price: '139.00',
						vip_price: '99.00',
						attributes: ['银色', '中尺码'],
						img: 'https://p3.ssl.qhimgs1.com/sdr/400__/t0485eb72d6fc28e0d9.jpg',
						is_goods: 1,
						isChecked: false,
					},
					{
						id: 1,
						name: '商用办公高性能台式机电脑整机',
						price: '3699.00',
						attributes: ['银色', '中尺码'],
						vip_price: '3600.00',
						img: 'https://p3.ssl.qhimgs1.com/sdr/400__/t0485eb72d6fc28e0d9.jpg',
						is_goods: 0,
						isChecked: false,
					},

				],
				goodsInfo: uni.getStorageSync('yihuogoods'),
				address: {},
			}
		},
		onLoad(){
			getStoreGoodsListYihuo(this.listQuery).then(res => {
				const list = [...res.data]
				list.forEach((el => {
					el['isChecked'] = false;
				}))
				this.goodsList = list;
			})
		},
		onShow(){
			getgoodsAddress({user_id: this.goodsInfo.user_id}).then(res => {
				if(!res.id)return uni.$u.toast('请先添加默认地址!');
				this.address = res;
			});
		},
		methods: {
			gotodetail(data){
				if(typeof data.attribute == 'string') data.attribute = JSON.parse(data.attribute)
				uni.setStorageSync('yihuogoods',data);
				uni.navigateTo({
					url: '/moduleC/details/details'
				})
			},
			addAddress() {
				uni.navigateTo({
					url: '/moduleB/AddressList/AddressList'
				})
			},
			toggleCheck(index) {
				const checked = !this.goodsList[index].isChecked;
				this.goodsList.forEach(el=>el['isChecked']=false);
				this.goodsList[index].isChecked = checked

			},
			onSkip(type) {
				switch (type) {
					case 'classify':
						uni.navigateTo({
							url: '/pages/SearchGoodsList/SearchGoodsList',
						})
						break;
					case 'goods':
						uni.navigateTo({
							url: '/pages/GoodsDetails/GoodsDetails',
							animationType: 'zoom-fade-out',
							animationDuration: 200
						})
						break;
				}
			},
			exchange() {
				const mygoods = this.goodsList.find(el => el.isChecked);
				console.log(mygoods,'======')
				if(!mygoods) return uni.$u.toast('请选择我兑换的商品!');
				const sendata = {
					goods_id: mygoods.id,
					address_id: this.address.id,
					togoods_id: this.goodsInfo.id,
					touser_id: this.goodsInfo.user_id,
					
				}
				yihuoorder(sendata).then(res => {
					uni.navigateTo({
						url: '/moduleC/exchangeOrder/exchangeOrder'
					})
				})
				// uni.navigateTo({
				// 	url: '/moduleC/exchangeOrder/exchangeOrder'
				// })
			}
		}

	}
</script>

<style scoped lang="scss">
	@import 'exchangeDeatils.scss'
</style>